{extend name="common:frm_base" /}
{block name="content"}
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-header">添加菜单</div>
        <div class="layui-card-body" style="padding: 15px;">
            <form class="layui-form" action="{:url('Menu/handle')}" lay-filter="component-form-group">
                <div class="layui-form-item">
                    <label class="layui-form-label">操作名称</label>
                    <div class="layui-input-block">
                        <input type="text" value="{$info['name']|default=''}" name="name" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">操作url</label>
                    <div class="layui-input-block">
                        <input type="text" name="action_url" value="{$info['action_url']|default=''}" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">icon</label>
                    <div class="layui-input-block">
                        <input type="text" name="icon" value="{$info['icon']|default=''}" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">类型</label>
                    <div class="layui-input-inline">
                        <select name="type" lay-filter="type">
                            <option value="">请选择类型</option>
                            <option value="1" {if $info->type == 1}selected{/if} >管理后台菜单</option>
                            <option value="2" {if $info->type == 2}selected{/if} >车企管理菜单</option>
                            <option value="3" {if $info->type == 3}selected{/if} >商家管理菜单</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-inline" id="menu_select">
                        <label class="layui-form-label">父菜单栏</label>
                        <div class="layui-input-inline" id="parent_select">
                            <select lay-filter="p_menu">
                                <option value="">选择上级菜单栏</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否菜单栏</label>
                    <div class="layui-input-block">
                        <input type="checkbox" {if $info.is_menu==1 }checked{/if} name="is_menu" lay-skin="switch" value="1" lay-text="YES|NO">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">排序</label>
                    <div class="layui-input-block">
                        <input type="text" name="sort" value="{$info['sort']|default=''}" placeholder="50" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">状态</label>
                    <div class="layui-input-block">
                        <input type="checkbox" name="status" {if $info.status==1 }checked{/if} lay-skin="switch" value="1" lay-text="ON|OFF">
                    </div>
                </div>
                {:token()}
                <input type="hidden" value="{$info.pid}" name="pid">
                <input type="hidden" value="{$act}" name="act" />
                <input type="hidden" value="{$info['id']|default=''}" name="id" />
                <div class="layui-form-item layui-hide">
                    <input type="button" lay-submit lay-filter="LAY-user-front-submit" id="LAY-user-front-submit" value="确认">
                </div>
                <!--<div class="layui-form-item layui-layout-admin">-->
                <!--<div class="layui-input-block">-->
                <!--<div class="layui-footer" style="left: 0;">-->
                <!--<button class="layui-btn" lay-submit="" lay-filter="component-form-demo1">立即提交</button>-->
                <!--<button type="reset" class="layui-btn layui-btn-primary">重置</button>-->
                <!--</div>-->
                <!--</div>-->
                <!--</div>-->
            </form>
        </div>
    </div>
</div>


<script>
    layui.config({
        base: '__LAYUIADMIN__/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'form', 'laydate'], function(){
        var $ = layui.$
            ,admin = layui.admin
            ,element = layui.element
            ,layer = layui.layer
            ,laydate = layui.laydate
            ,form = layui.form;
        var pid = 0;
        var type = 0;

        form.render(null, 'component-form-group');

        laydate.render({
            elem: '#LAY-component-form-group-date'
        });

        form.on('select(type)', function(data){
            var type = data.value;
            console.log(type);
            $.ajax({
                type: "POST",
                url: "{:url('Menu/getChildMenu')}",
                data: {pid : pid, type:type},
                dataType: "json",
                success: function(data){
                    if (data.code == 0){
                        var list = data.data;
                        var html = "<div class='layui-input-inline '><select lay-filter='p_menu'><option value=''>选择菜单栏</option>";
                        for(var i=0; i<list.length; i++){
                            html += "<option value='"+list[i]['id']+"'>"+list[i]['name']+"</option>";
                        }
                        html += "</select></div>";
                        $("#parent_select").html(html);
                        form.render(null, 'component-form-group');
                    }
                },
            });
        });

        form.on('select(p_menu)', function(data){
            var pId = data.value;
            $("input[name='pid']").val(pId);
            if (pId <= 0){
                return;
            }
            $(".p_child").remove();
            $.ajax({
                type: "POST",
                url: "{:url('Menu/getChildMenu')}",
                data: {pid : pId},
                dataType: "json",
                success: function(data){
                    if (data.code == 0){
                        var list = data.data;
                        var html = "<div class='layui-input-inline p_child'><select lay-filter='p_child'><option value=''>选择上级菜单栏</option>";
                        for(var i=0; i<list.length; i++){
                            html += "<option value='"+list[i]['id']+"'>"+list[i]['name']+"</option>";
                        }
                        html += "</select></div>";
                        $("#menu_select").append(html);
                        form.render(null, 'component-form-group');
                    }
                },
            });
        });

        form.on('select(p_child)', function(data){
            var pId = data.value;
            $("input[name='pid']").val(pId);
            if (pId <= 0){
                return;
            }
            $.ajax({
                type: "POST",
                url: "{:url('Menu/getChildMenu')}",
                data: {pid : pId},
                dataType: "json",
                success: function(data){
                    if (data.code == 0){
                        var list = data.data;
                        var html = "<div class='layui-input-inline p_child'><select lay-filter='p_child'><option value=''>选择上级菜单栏</option>";
                        for(var i=0; i<list.length; i++){
                            html += "<option value='"+list[i]['id']+"'>"+list[i]['name']+"</option>";
                        }
                        html += "</select></div>";
                        $("#menu_select").append(html);
                        form.render(null, 'component-form-group');
                    }
                },
            });
        });
    });
</script>
{/block}